<template>
  <div>
    <div>
      <h3>简单数组
        <button @click="changeFirst">改变第一个值</button>
        <button @click="addOne">增加一个值</button>
        <button @click="deleteOne">删除一个值</button>
        <button @click="replaceOne">替换一个值</button>
      </h3>
      <span v-for="one in arr" :key="one">{{one}}</span>
    </div>
  </div>
</template>

<script>
export default {
  data(){
    return{
      arr: [ 1,2,3 ]
    }
  },
  methods:{
    changeFirst(){
      // 这个时错误示范
      // 通过索引修改数组的值，不会页面视图不会变化
      console.log('this.arr',this.arr);
      this.arr[0] = Date.now();
    }
  }
}
</script>

<style>

</style>